<template>
  <div class="plant-container">
    <el-row :gutter="20" style="margin:10px;">
      <el-col :span="4" :offset="20">
        <el-button type="primary" @click="download" >导出表格</el-button>
      </el-col>
    </el-row>
     <el-table align="center" border :data="plantData" style="width: 100%">
      <el-table-column label="Id" prop="Id" align="center" width="50">
      </el-table-column>
       <el-table-column label="厂房名称" prop="_plant" align="center"  width="150">
      </el-table-column>
       <el-table-column label="面积" prop="area" align="center" width="100">
      </el-table-column>
      <el-table-column label="创建时间" prop="_time" align="center">
      </el-table-column>
       <el-table-column label="创建者" prop="founder" align="center" width="150">
      </el-table-column>
       <el-table-column label="厂长" prop="manager" align="center"   width="150">
      </el-table-column>
       <el-table-column label="车间数" prop="workshop_num" align="center" width="100">
      </el-table-column>
      <el-table-column  label="操作" align="center">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">详情</el-button>
          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
     <el-row :gutter="20" style="margin-top:10px;">
      <el-col :span="6" :offset="18">
        <div class="grid-content bg-purple pagination">
          <el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next" :total="total" :page-size="5">
          </el-pagination>
      </div></el-col>
    </el-row>
  </div>
</template>
<script>
import {searchPlant} from '../../api/api'
import {downloadFile} from '../../api/api'
import {delPlant} from '../../api/api'
import moment from 'moment'
 export default {
       data() {
      return {
        plantData:[],
        search: '',
        total:null,
        plant:[],
        cur_page:1
      }
    },
    created(){
      this.getPlantDetail();
    },
    methods: {
      handleEdit(index,row){
        this.$router.push(`/rta/${row.plant}`);
      },
      handleDelete(index,row){
        this.$confirm('确认提交吗？', '提示', {}).then(() => {
						delPlant(row).then((res) => {
							//NProgress.done();
							this.$message({
								message: '删除成功',
								type: 'success'
							});
              this.getPlantDetail();
						});
					});
      },
      // 分页导航
      handleCurrentChange(val) {
          this.cur_page = val;
          this.getPlantDetail();
      },
      getPlantDetail(){
        this.plant = [];
        let username = sessionStorage.getItem('user');
        let page = this.cur_page;
        searchPlant({username:username,page:page}).then(res=>{
            let {result,total} = res; 
            result.forEach(item=>{
                item._plant = `厂房${item.plant}`;
                item._time = moment(item.develop_time).format("YYYY-MM-DD HH:mm:ss");
            });
            this.plantData = result;
            this.total = total;
        })
      },
      download(){
        downloadFile({filename:"plant"}).then(res=>{
          let {code,path} = res;
          if(code == 1)
             window.location.href = path;
          else
            this.$message({
                  message:'下载失败',
                  type: 'error'
            });
        });
      }
    }
  }
</script>
<style lang="scss">
.plant-container{
    margin: 5px;
}
.cell{
  display: block;
}
</style>

